@tailwind base;
@tailwind components;
@tailwind utilities;
*::-webkit-scrollbar {
    width: 3px;
}
*::-webkit-scrollbar-thumb {
    background-color: #2563eb;
}
.position-container {
    @apply max-w-7xl mx-auto
}
.iamge1 {
    filter: blur(8px);
}
.clearfix:before,.clearfix:after {
    content :"";
    display:table;/*转换成表格*/
 }
.clearfix:after {
    clear:both;
}
.w-e-scroll {
    overflow-y: hidden!important;
}
.text-over {
    display: inline-block;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow:ellipsis;
}
.text-over-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.text-over-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.text-over-6 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
}


.cc {
    position: relative;
}

.cc::after {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    top: 0;
    left: 0;
    transition: all .6s;
    z-index: -9;
}

.cc:hover::after {
    width: 100%;
    background-color: rgb(37 ,99 ,235 );
}

.hover-bottom-line {
    position: relative;
    backdrop-filter: blur(10px);
}
.hover-bottom-line:hover::after{
    width: 100%
}
.hover-bottom-line::after {
    content: "";
    position: absolute;
    transition: width;
    transition-duration: .7s;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 0;
    border-radius: 0.5rem;
    background-color: rgb(37 ,99 ,235 )
}

@keyframes bottom-line-active {  
    0% {  
      width: 0;
    }  
    100% {  
      width: 100%;
    }  
  }  
    
.hover-bottom-line-v2 {
    position: relative;
} 
.hover-bottom-line-v2::after {
    content: "";
    position: absolute;
    width: 0;
    height: 4px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    background-color: #2563eb;
    animation: bottom-line-active .5s forwards;
}